<!--市公司下发-->
<template>
  <div class="contents-main">
    <!--筛选区域-->
    <div class="screening">
      <div class="theMenu">
        <span>{{ companyName }}</span><span @click="screening" v-if="$store.state.thePartyBranch321.selectCompany"><van-icon name="filter-o"/>筛选</span>
      </div>
    </div>
    <van-collapse v-model="activeNames">
      <!--杭州分公司321任务列表-->
      <van-collapse-item :value="activeNames.includes('complete') ? '收起' : '展开'" name="complete" title-class="titleCard" value-class="valueCard">
        <template #title>
          <div class="title"><img src="@/assets/static/image/thePartyBranch321/biaoti@2x.png" alt="">{{ companyName }}321任务列表</div>
        </template>
        <CardList type="theCityListCompany" :companyName="companyName" ref="theTaskList"></CardList>
      </van-collapse-item>
      <!--待处理的省公司下发任务-->
      <van-collapse-item :value="activeNames.includes('toBeProcessed') ? '收起' : '展开'" name="toBeProcessed" title-class="titleCard" value-class="valueCard">
        <template #title>
          <div class="title"><img src="@/assets/static/image/thePartyBranch321/biaoti@2x.png" alt="">待处理的省公司下发任务</div>
        </template>
        <CardList type="cityCompanyUnfinishedList" :companyName="companyName" ref="toBeProcessed"></CardList>
      </van-collapse-item>
    </van-collapse>
    <!--筛选弹窗-->
    <van-popup v-model="show" round position="bottom">
      <van-picker show-toolbar title="请选择" :columns="orgList" @confirm="onConfirm" @cancel="onCancel"/>
    </van-popup>
  </div>
</template>
<script>
import CardList from "components/workReminders/CardList.vue";
import * as _ from "lodash";

export default {
  components:{ CardList },
  data() {
    return {
      activeNames: ['complete','toBeProcessed'],//默认展开选项
      companyName:'',//公司名称
      show:false,//筛选弹窗状态
      orgList:[],//公司名称数组
    };
  },
  created(){
    this.getOrg()
  },
  methods:{
    /**
     * 筛选弹窗确认
     * @param value 选择的值
     */
    async onConfirm(value){
      this.companyName = value
      await this.$nextTick(() => {
        this.$refs.toBeProcessed.screening()
        this.$refs.theTaskList.screening()
      })
      this.show = false
    },
    /**
     * 筛选弹窗取消
     */
    onCancel() {
      this.show = false
    },
    /**
     * 筛选弹窗
     */
    screening(){
      this.show = !this.show
    },
    /**
     * 设置公司组织
     */
    async getOrg() {
      const data = _.cloneDeep(this.$store.state.thePartyBranch321.orgList);
      delete data['省公司']
      this.orgList = Object.keys(data)
      if ( this.$store.state.thePartyBranch321.userInfo.companyName === "省公司" ) {
        // 如果用户是省公司成员，下拉框默认选中第一条数据
        this.companyName = Object.keys(data)[0];
      } else {
        this.companyName = this.$store.state.thePartyBranch321.userInfo.companyName;
      }
    },
  }
};
</script>



<style scoped lang="less">
@import "@/assets/css/thePartyBranch321/thePartyBranch321.less";
</style>